<template>
  <div style="width: 100%;">
    <q-card>
      <q-card-section class="row justify-between">
        <div><slot name="header-left">left</slot></div>
        <div><slot name="header-center">center</slot></div>
        <div><slot name="header-right">right</slot></div>
      </q-card-section>
      <q-card-section id="data" class="q-gutter-md scroll-y">
        <div v-for="(item,index) in data" :key="index">
          <div v-if="item.tag=== 'input'">
            <q-input v-model="item.value" :type="`${item.type}`" :label="item.label" :stack-label="item.type==='date'" outlined dense></q-input>
          </div>
          <div v-else-if="item.tag === 'select'">
            <q-select v-model="item.value"  :label="item.label" :options="item.options ? item.options : ''" outlined dense></q-select>
          </div>
          <div v-else-if="item.tag === 'file'">
            <q-file v-model="item.value" :label="item.label" outlined dense></q-file>
          </div>
        </div>
      </q-card-section>
      <q-card-section class="row justify-between">
        <div><slot name="footer-left">left</slot></div>
        <div><slot name="footer-center">center</slot></div>
        <div><slot name="footer-right">right</slot></div>
      </q-card-section>
    </q-card>
  </div>
</template>

<script>
import { defineComponent, onMounted } from 'vue'
// import EnterpriseFactory from 'components/commonComponent/EnterpriseFactorySelect'
export default defineComponent({
  name: 'Assignment',
  components: { },
  props: {
    data: {
      type: Array,
      required: true,
      default: function () {
        return []
      }
    }
    // columns: {
    //   type: Array,
    //   required: true,
    //   default: function () {
    //     return []
    //   }
    // }
  },
  setup () {
    // const data = ref([
    //   { label: '日期', tag: 'input', type: 'date', value: '' },
    //   { label: '版本名称', tag: 'input', value: '' },
    //   { label: '数字', tag: 'input', type: 'number', value: '' },
    //   { label: '批复文件', tag: 'file', type: 'file', value: [] },
    //   { label: '项目性质', tag: 'select', options: ['未知', '新建', '技改', '扩建', '搬迁', '其他'], value: '未知' },
    //   { label: '项性质', tag: 'select', options: ['未知', '新建', '技改', '扩建', '搬迁', '其他'], value: '' },
    //   { label: '项目性', tag: 'select', options: ['未知', '新建', '技改', '扩建', '搬迁', '其他'], value: '' }
    // ])
    onMounted(() => {
    })
    return {
    }
  }
})
</script>

<style scoped>

</style>
